
<template>
    <div><el-menu
            :default-active="activeIndex"
            class="el-menu-demo"
            mode="horizontal"
            @select="handleSelect"
            active-text-color="#ffd04b"
    >
        <el-menu-item index="1">处理中心</el-menu-item>
        <el-submenu index="2">
            <template slot="title">我的工作台</template>
            <el-menu-item index="2-1">选项1</el-menu-item>
            <el-menu-item index="2-2">选项2</el-menu-item>
            <el-menu-item index="2-3">选项3</el-menu-item>
        </el-submenu>
        <el-menu-item index="3" disabled>消息中心</el-menu-item>
        <el-menu-item index="4" class="bb"><span>欢迎   {{name}}</span>   </el-menu-item>
        <el-menu-item index="5" class="aa" @click="logout"><i class="el-icon-switch-button" ></i>退出</el-menu-item>

    </el-menu></div>
</template>
<script>
    export default {
        data() {
            return {
                activeIndex: "1",
                activeIndex2: "2",

            };
        },
        computed:{
            stuNum(){
                return this.$store.state.userInfo.stuNum||[]
            },
            stuName(){
                return this.$store.state.userInfo.stuName||[]
            },
            name(){
                return this.$store.state.name
            }
        },

        methods: {
            handleSelect(key, keyPath) {
                console.log(key, keyPath);
            },
            logout(){
                this.$router.push('/stulogin')
            },
            //判断是否登陆了
    IsLogin(){
      if(this.name==''){
    this.$router.push('/stulogin')
      }
    }
        },
        mounted(){
            console.log(this.$store.state)
            this.IsLogin()
        },
    };
</script>
<style scoped>
    .aa{
        position: relative;
        margin-left:70px;

    }
    .bb{
        margin-left:50%;

    }
</style>
